<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>谭梦娜-轻松批首页</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div class="warp">
        <div class="header">
            <div class="content">
            <div class="header-left">
               <img src="img/logo.png" alt="logo">
               <span>让批发更轻松</span>
            </div>
            <div class="header-mid">
                <ul>
                    <li class="active"><span><a href="https://www.runoob.com/">首页</a></span></li>
                    <li><span><a href="https://www.runoob.com/">服务</a></span></li>
                    <li><span><a href="https://www.runoob.com/">定价</a></span></li>
                    <li><span><a href="https://www.runoob.com/">关于</a></span></li>
                </ul>
            </div>
            <div class="header-right">
                <button>立即申请</button>
                <span>123456789</span>
                <img src="img/h24.png" alt="phone">
             </div>
        </div>
        </div>
        <div class="banner">
            <div class="content">
                <div class="banner-left">
                    <h1>批发，从未如此轻松</h1>
                    <p>重新定义批发，为您链接所有的客户</p>
                    <p>拥抱移动互联网，助你生意腾飞</p>
                    <span>申请免费试用</span>
                </div>
                <div class="banner-right">
                    <img src="img/p1.png" alt="">
                </div>
            </div>
        </div>
        <div class="icon">
            <div class="content">
              <ul>
                <li>
                  <div class="icon-box">
                    <img src="./img/p2.png" alt="">
                    <h3>掌握店铺</h3>
                    <p>实时数据同步，了解店铺运营情况<br>所有店铺状态，随时随地一手掌握</p>
                  </div>
                </li>
                <li>
                  <div class="icon-box">
                    <img src="./img/p3.png" alt="">
                    <h3>安全稳定</h3>
                    <p>实时数据同步，了解店铺运营情况<br>所有店铺状态，随时随地一手掌握</p>
                  </div>
                </li>
                <li>
                  <div class="icon-box">
                    <img src="./img/p4.png" alt="">
                    <h3>无需网络</h3>
                    <p>实时数据同步，了解店铺运营情况<br>所有店铺状态，随时随地一手掌握</p>
                  </div>
                </li>
                <li>
                  <div class="icon-box">
                    <img src="./img/p5.png" alt="">
                    <h3>专属网店</h3>
                    <p>实时数据同步，了解店铺运营情况<br>所有店铺状态，随时随地一手掌握</p>
                  </div>
                </li>
              </ul>
            </div>
          </div>
        
        <div class="youshi"></div>
        <div class="shop"></div>
        <div class="help"></div>
        <div class="cnntact"></div>
        <div class="footer"></div>
        <div class="botton"></div>
    </div>
</body>
</html>